<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Themes | Hexo</title>
    <link rel="icon" href="img/logo.svg" type="image/x-icon">
</head>
<link rel="stylesheet" type="text/css" href="style.css">

<body>
    <div class="view">

        <div id="nav">
            <a href="##" class="navA">Docs</a>
            <a href="##" class="navA">API</a>
            <a href="##" class="navA">News</a>
            <a href="##" class="navA">Plugins</a>
            <a href="##" class="navA">Themes</a>
            <a href="##" class="navA">About</a>
            <div class="Languge">
                <i class="iconfont icondiqiu"></i>
                <select>
                    <option selected>English</option>
                    <option>正體中文</option>
                    <option>简体中文</option>
                    <option>Русский</option>
                    <option>한국어</option>
                    <option>Português (Brasil)</option>
                    <option>ภาษาไทย</option>
                </select>
            </div>
        </div>

        <div class="all">
            <div class="head">

                <!-- 头部内容 -->
                <div class="navLeft">
                    <i class="iconfont icondaohang"></i>
                </div>
                <div class="headAll">

                    <!-- logo -->
                    <div class="logoBox">
                        <a href="#" class="logo">
                            <img src="img/logo.svg">
                        </a>
                    </div>

                    <div class="head-content">

                        <!-- 头部导航 -->
                        <div class="nav">
                            <a href="##">Docs</a>
                            <a href="##">API</a>
                            <a href="##">News</a>
                            <a href="##">Plugins</a>
                            <a href="##">Themes</a>
                            <a href="##">About</a>
                            <a href="###" style="text-decoration: none;"><i class="iconfont icongithubalt"></i></a>
                        </div>
                        <!-- 头部搜索框 -->
                        <div class="searchBox">
                            <i class="iconfont iconfangdajing"></i>
                            <input type="text" placeholder="Search...">
                        </div>
                        <!-- 头部语言切换 -->
                        <div class="languge">
                            <i class="iconfont icondiqiu"></i>
                            <select>
                                <option selected>English</option>
                                <option>正體中文</option>
                                <option>简体中文</option>
                                <option>Русский</option>
                                <option>한국어</option>
                                <option>Português (Brasil)</option>
                                <option>ภาษาไทย</option>
                            </select>
                        </div>
                    </div>

                </div>
            </div>

            <div class="middleHead">
                <h1>Themes</h1>
            </div>
            <!-- 中间的一个搜索框 -->
            <div class="middleSearch">
                <p>334 items</p>
                <input type="text" placeholder="Search">
            </div>

            <div class="content">
                <div class="content-top">


                    <a href="###"><i class="iconfont iconeye"></i></a> 

                    <img src="img/beautiful-hexo@2x.jpg" class="img">

                    <!-- <div class="black"></div> -->
                    <!-- <div class="close"></div> -->

                </div>
                <div class="content-bottom">
                    <a href="##" class="A">
                        <h3>beautiful-hexo</h3>
                    </a>
                    <p>A simple responsive beautiful theme</p>
                    <div class="label">
                        <a href="#">#responsive</a>
                        <a href="#">#beautiful</a>
                        <a href="#">#simple</a>
                        <a href="#">#white</a>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/amorfati@2x.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>Amorfati</h3>
                    </a>
                    <p>A responsive simple theme</p>
                    <div class="label">
                        <a href="#">#Responsive</a>
                        <a href="#">#Korean</a>
                        <a href="#">#한국어</a>
                        <a href="#">#Pug</a>
                        <a href="#">#Sass</a>
                        <a href="#">#SEO</a>
                        <a href="#">#Simple</a>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/nlvi@2x.jpg" class="img">
                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>Nlvi</h3>
                    </a>
                    <p>A simple theme named Nlvi</p>
                    <div class="label">
                        <a href="#">#horizontal&vertical</a>
                        <a href="#">#animate</a>
                        <a href="#">#English</a>
                        <a href="#">#中文</a>
                        <a href="#">#日本語</a>
                    </div>
                </div>
            </div>


            <div class="content">
                <div class="content-top">
                    <a href="####"><i class="iconfont iconeye"></i></a>
                    <img src="img/fun@2x.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>fun</h3>
                    </a>
                    <p>a responsive design theme</p>
                    <div class="label">
                        <a href="#">#responsive</a>
                        <a href="#">#clean</a>
                        <a href="#">#simple</a>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="####"><i class="iconfont iconeye"></i></a>
                    <img src="img/prowiki@2x.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>ProWiki</h3>
                    </a>
                    <p>Designed to display articles like wiki.</p>
                    <div class="label">
                        <a href="#">#wiki</a>
                        <a href="#">#black</a>
                        <a href="#">#no fancy</a>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/paper@2x.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>Paper</h3>
                    </a>
                    <p>A Simple Clean Paper-like Theme for Hexo with Darkmode!</p>
                    <div class="label">
                        <a href="#">#dark-mode</a>
                        <a href="#">#paper-like</a>
                        <a href="#">#clean</a>
                        <a href="#">#responsive</a>
                        <a href="#">#color-config</a>
                        <a href="#">#中文</a>
                        <a href="#">#English</a>
                    </div>
                </div>
            </div>

            <!-- 全部小盒子 -->

            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/element.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="##">
                        <h3>Element</h3>
                    </a>
                    <p>Another minimal theme</p>
                    <div class="label">
                        <a href="#">#responsive</a>
                        <a href="#">#one_column</a>
                        <a href="#">#search</a>
                        <a href="#">#minimalism</a>
                        <a href="#">#dark_mode</a>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/particle.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>Particle</h3>
                    </a>
                    <p>A concise theme with 3 color styles.</p>
                    <div class="label">
                        <a href="#">#Vue</a>
                        <a href="#">#home-figure</a>
                        <a href="#">#Chinese</a>
                        <a href="#">#中文</a>
                        <a href="#">#3-color-styles</a>
                        <a href="#">#dark_mode</a>
                        <a href="#">#maiden_mode</a>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/mintin.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>mintin</h3>
                    </a>
                    <p>A simple theme</p>
                    <div class="label">
                        <a href="#">#simple</a>
                        <a href="#">#light</a>
                        <a href="#">#clean</a>
                    </div>
                </div>
            </div>


            <div class="content">
                <div class="content-top">
                    <a href="####"><i class="iconfont iconeye"></i></a>
                    <img src="img/dearmsdan@2x.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>Dearmsdan</h3>
                    </a>
                    <p>HEXO-Dearmsdan The theme is in a dark color, It gives people a sense of emptiness</p>
                    <div class="label">
                        <a href="#">#中文</a>
                        <a href="#">#简约</a>
                        <a href="#">#分类</a>
                        <a href="#">#bootstrap</a>
                        <a href="#">#shadows</a>
                        <a href="#">#classification</a>

                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="####"><i class="iconfont iconeye"></i> </a>
                    <img src="img/meilidu.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>MeiliDu</h3>
                    </a>
                    <p>A beautiful read</p>
                    <div class="label">
                        <a href="#">#typography</a>
                        <a href="#">#responsive</a>
                        <a href="#">#writing</a>
                        <a href="#">#big_header</a>
                        <a href="#">#simple</a>

                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/edinburgh.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>Edinburgh</h3>
                    </a>
                    <p>Clean, beautiful portfolio theme</p>
                    <div class="label">
                        <a href="#">#responsive</a>
                        <a href="#">#clean</a>
                        <a href="#">#beautiful</a>
                        <a href="#">#minimal</a>
                        <a href="#">#simple</a>
                        <a href="#">#gallery</a>
                        <a href="#">#portfolio</a>
                    </div>
                </div>
            </div>


            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/artemis.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="##">
                        <h3>artemis</h3>
                    </a>
                    <p>A minimalist theme inspired by Apollo, built with Pug and Sass</p>
                    <div class="label">
                        <a href="#">#responsive</a>
                        <a href="#">#minimalist</a>
                        <a href="#">#light</a>
                        <a href="#">#pug</a>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/keep@2x.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>Keep</h3>
                    </a>
                    <p>A simple and elegant theme for Hexo</p>
                    <div class="label">
                        <a href="#">#clean</a>
                        <a href="#">#powerful</a>
                        <a href="#">#responsive</a>
                        <a href="#">#dark/light</a>
                        <a href="#">#中文</a>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/cxo.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>Cxo</h3>
                    </a>
                    <p>A cool ，simple & beautiful theme</p>
                    <div class="label">
                        <a href="#">#cool</a>
                        <a href="#">#中文</a>
                        <a href="#">#simple</a>
                        <a href="#">#beautiful</a>
                    </div>
                </div>
            </div>


            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/casual@2x.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="##">
                        <h3>casual</h3>
                    </a>
                    <p>A simple and cool theme</p>
                    <div class="label">
                        <a href="#">#responsive</a>
                        <a href="#">#comfortable</a>
                        <a href="#">#blog</a>
                        <a href="#">#fresh</a>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/icer@2x.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>Icer</h3>
                    </a>
                    <p>A simple theme</p>
                    <div class="label">
                        <a href="#">#simple</a>
                        <a href="#">#one_column</a>
                        <a href="#">#beautiful</a>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/xoxo-plus.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>xoxo-plus</h3>
                    </a>
                    <p>A Simple Template</p>
                    <div class="label">
                        <a href="#">#中文</a>
                        <a href="#">#simple</a>
                        <a href="#">#blog</a>
                        <a href="#">#responsive</a>
                    </div>
                </div>
            </div>


            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/still@2x.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="##">
                        <h3>still</h3>
                    </a>
                    <p>Still is a minimal, pure colored theme inspired by farbox and apollo</p>
                    <div class="label">
                        <a href="#">#responsive</a>
                        <a href="#">#minimal</a>
                        <a href="#">#pure</a>
                        <a href="#">#clean</a>
                        <a href="#">#one_column</a>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/simple.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>Simple</h3>
                    </a>
                    <p>Simple & Fresh, written with jade & less</p>
                    <div class="label">
                        <a href="#">#simple</a>
                        <a href="#">#fresh</a>
                        <a href="#">#responsive</a>
                        <a href="#">#jade</a>
                        <a href="#">#less</a>
                        <a href="#">#one_column</a>
                    </div>
                </div>
            </div>
            <div class="content">
                <div class="content-top">
                    <a href="###"><i class="iconfont iconeye"></i></a>
                    <img src="img/nexmoe.jpg" class="img">

                </div>
                <div class="content-bottom">
                    <a href="#">
                        <h3>Nexmoe</h3>
                    </a>
                    <p>A special Hexo theme</p>
                    <div class="label">
                        <a href="#">#Sidebar</a>
                        <a href="#">#中文</a>
                        <a href="#">#Internationalization</a>
                        <a href="#">#Shadow</a>
                        <a href="#">#Light box</a>
                        <a href="#">#Album</a>
                        <a href="#">#Links</a>
                        <a href="#">#Cover Picture</a>
                    </div>
                </div>
            </div>
            <div class="close"></div>

        </div>

    </div>
</body>
<script type="text/javascript" src="script.js"></script>

</html>